<!DOCTYPE html>

<html>
    
    <head>
        
        <meta charset="utf-8">
        <title>TM Editor</title>
        
        <link rel="stylesheet" href="./../style.css" type="text/css" /> 
        <script type="text/javascript" src="./script.js"></script>
        
    </head>
    
    <body>
        <header id="header">
            <h1>TM Editor</h1>
            <p>
                HTML5 の Web Storage API と File API を使って作った Editor です.
            </p>
        </header>
        
        <div id="main-wrap">
            <div id="main">
                <aside id="sidebar">
                    <h2>File List</h2>
                    <select size="8" id="file-list"></select>
                    <button id="open">Open</button>
                    <button id="delete">Delete</button>
                    <button id="rename">Rename</button>
                </aside>
                
                <section id="content">
                    <h2>Editor</h2>
                    <div id="file-header-list">
                        <div class="file-header">
                            <div class="file-name">Untitled</div>
                        </div>
                    </div>
                    <textarea id="main-ta" rows="32" cols="80" wrap="off"></textarea>
                    
                    <footer style="text-align:right">
                        <button id="save">Save</button>
                        <button id="save-as">Save As</button>
                        <button id="clear">Clear</button><br />
                        <label>Read : <input id="read" type="file" /></label><br />
                        <button id="download">Download</button><br />
                        <label>Import : <input id="import" type="file" /></label><br />
                        <button id="export">Export</button>
                    </footer>
                </section>
            </div>
        </div>
        
        <footer id="footer">
            <p><a href="#">Home</a></p>
        </footer>
        
    </body>
    
</html>



